<template>
  <div class="change-log">
    <Timeline>
      <TimelineItem v-for="(item, index) in changelog" :key="index" :color="item.importance ? 'red': 'blue'">
        <p class="time">{{item.update_date}}</p>
        <div class="content">
          <p class="content-item-p" v-for="(str, index2) in item.content" :key="index2">
            {{index2 + 1}}、{{str}}
          </p>
        </div>
      </TimelineItem>
    </Timeline>
  </div>
</template>

<script>
  import changelog from './changelog.json'
  export default {
    name: 'ChangeLog',
    data() {
      return {
        changelog: changelog
      }
    },
    mounted() {

    },
    methods: {},
    computed: {}
  }
</script>

<style scoped>
.time{
  font-size: 12px;
  font-weight: bold;
}
.content {
  padding-top: 5px;
}
.content-item-p {
  font-size: 14px;
}
</style>
